<script lang="ts" setup>
import { User } from '@element-plus/icons-vue';
import { Summary } from '@/types/data';
import useStore from "@/store";
import { storeToRefs } from "pinia";
const { posts } = useStore();
const { list } = storeToRefs(posts);
const { getSummary } = posts;
const props = defineProps<{
	idx: number,
}>();
const author: Summary = getSummary('hhhhhhhhhhhhhhhhh', 20);
</script>

<template>
	<div class="post-bar-right">
		<div>
			<el-icon>
				<User />
			</el-icon>
			<span>{{ author.sum }}</span>
			<template v-if="author.dots">...</template>
		</div>
		<div>发布于 {{ list[idx].postCreateTime }}</div>
	</div>
</template>

<style  lang="scss" scoped>
.post-bar-right {
	float: left;
	width: 23%;
	color: #999;
	padding-left: 8px;

	div {
		margin-bottom: 15px;

		span {
			margin-left: 6px;
			vertical-align: bottom;
		}
	}

	::v-deep .el-icon {
		font-size: 18px;
		vertical-align: middle;
	}
}
</style>
